<%@ include file="/WEB-INF/view/include.jsp"%>


<div class="t_tmiddle-right">
	<div id="tabs">
      <ul id="TabHeader">
        <li><a href="#MainDetails"><spring:message code="header.app.details" /></a></li>  
      </ul>
		<form:form modelAttribute="submitExitPaperModel" name="submitExitPaperModel"
			id="submitExitPaperModel" method="POST" enctype="multipart/form-data"
			class="t_form" action="client/company/evterminate/exitpaper/form.htm?appId=${appId}">
			<spring:hasBindErrors name="submitExitPaperModel">
				<script type="text/javascript">
					$(document)
							.ready(
									function() {
										jAlert(
												'error',
												'<li><form:errors path="*" delimiter="<li>"/>',
												'<spring:message code="label.errormessage" />');
									});
				</script>
			</spring:hasBindErrors>

			<%@include file="MainTab.jsp"%>
		</form:form>
	</div>
</div>
<!--Middle Right Close-->
<script>
	//Validation - Required fields
	$()
			.ready(
					function() {
						
						$("#submitExitPaperModel").validate({

							onfocusout:false,
							onkeyup:false,
							onclick: false,			
							rules : {
								//Employee Details
								exitPaper : {
									required : true
								}
							},
							
							submitHandler: function (form) {
								blockPage();
								form.submit();
							},
							
							showErrors : function(errorMap, errorList) {
								
								var errors = '<ul>';
								var label;				
								if (errorList.length) {
									$.each(errorMap, function(name, value) {
										label = $("label[for='" + name + "']").html();
										label = value + '[' + label + ']';
										errors = errors + '<li>' + label + '</li>';
										

									});
									errors = errors + '</ul>';
									jAlert('error', errors, '<spring:message code="label.errormessage" />');
									return false;
								}
							}		
						});
						
						$tabs = $("#tabs").tabs();	
						$('#TabHeader').removeClass('ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all');
						$('#TabHeader > li').removeClass('ui-state-default ui-corner-top ui-state-active ui-state-hover');
						$('#tabs').removeClass('ui-widget ui-widget-content ui-corner-all');
						
						$('#tabs').tabs({
							select : function(event, ui) {
								
								var selected = $tabs.tabs('option', 'selected'); // => 0
								var clicked = ui.index; // => 0
													
								if( selected > clicked )
									return true;
								
								var isValid = validate();// form validation returning true or false
								
								return isValid;
							}
						});
					});
	
	jQuery(document).ready(
			function() {
				EmployeeAutoFiller.init("evcEmployeeId");
				EmployeeAutoFiller.defineFieldMapping("empNameEn",
				"empName");
				EmployeeAutoFiller.defineFieldMapping("empPostNo",
						"empPostNoMap");
				EmployeeAutoFiller.defineFieldMapping("empNationality",
						"empNationalityMap");
				EmployeeAutoFiller.defineFieldMapping("empCECNo",
						"empCECNoMap");
				EmployeeAutoFiller.defineFieldMapping("empNameAr",
						"empNameAr");
				EmployeeAutoFiller.fillFields();
			});
</script>